<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>hello world</title>
    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
</head>
<body>
    <div id="div">
        <p>
            {{msg}}
            {{count + 1}}
            <br>
            姓名：{{user.name}}
            年龄：{{user.age}}
            性别：{{user.sex}}
            <br>
            数组：{{arr[1]}}
            <br>
            {{helloWorld()}}
        </p>
    </div>
</body>
    <script>
        new Vue({
            //id
            el: "#div",
            data:{
                //json数据
                msg: "hello world!",
                count: 1,
                user: {
                    name: "添龙",
                    age: 22,
                    sex: "男"
                },
                arr: ["javaee","javase"]
            },
            methods: {
                //ES6支持
                helloWorld(){
                    //调用方法
                    this.say();
                    //this调用data数据
                    this.user.name = "佳伟";
                        return "HELLO WORLD!!!"
                },
                say:function (){
                    console.log("执行了say方法")
                }
            }
        })
    </script>
</html>